<template>
    <div style="text-align: center;color: black;">
        <br>
        <br>
        <br>
        <h1>用户邮箱 : {{ this.user.email }}</h1>
        <br>
        <br>
        <br>
        <h1>账号剩余token : {{ this.user.token }} </h1>
        <h1>( 约 {{ formatToken() }} ) </h1>
        <br>
        <br>
        <br>
        <h1>微信账号:</h1>
        <div v-show="this.user.nickName">
            <h1>{{ this.user.nickName }}</h1>
            <img style="width: 100px;height: 100px;" :src="this.user.headImg" alt="none">
        </div>
        <div v-show="!this.user.nickName">
            <h1>暂未绑定微信</h1>
        </div>
        <br>
        <br>
        <el-popconfirm @confirm="logout" title="确定退出登录?" confirm-button-text="确定" cancel-button-text="取消">
            <template #reference>
                <el-button  type="warning">退出登录</el-button>
            </template>
        </el-popconfirm>
    </div>

</template>

<script>
import { getUserInfo } from '@/api/user'
export default {
    data() {
        return {
            user: {}

        }
    },
    methods: {
        getInfo() {
            getUserInfo().then(res => {
                console.log(res)
                this.user = res.data
            })

        },
        formatToken() {
            if (this.user.token >= 20000) {
                return `${(this.user.token / 20000).toFixed(1)} 万字`;
            } else {
                return `${Math.floor(this.user.token / 2)} 字`;
            }
        },
        logout() {
            this.$message.success('已退出登录')
            localStorage.clear()
            this.$router.push('/login')
        }
    },
    mounted() {
        this.getInfo()
    }

}
</script>

<style></style>